<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>测试js加载和页面渲染</title>
<style>
#a,#b,#c{padding:10px;margin-top:20px;}
#a{background-color:#EEE;}
#b{background-color:#DDD;}
#c{background-color:#CCC;}
</style>
</head>

<body>
	<div id="a">
		<p> Can script read me ?---p1</p>
		<script>alert(document.getElementById("a").innerHTML);</script>
		<p> Can script read me ?---p2</p>
	</div>
	
	<div id="b">
		<p> Can script read me ?---p1</p>
		<script>alert(document.getElementById("b").innerHTML);var x = "what's U see";</script>
		<script>var y = "unknown";</script>
		<p> Can script read me ?---p2</p>
	</div>
	
	<div id="c">
		<p>第一个例子的结论是：script在加载的时候会阻止页面渲染</p>
		<p>第二个例子的结论是：script在加载的时候会先将整个script块加载后再调用解释器执行语句</p>
	</div>
</body>
</html>
